<template>
  
      <div class="second_bottom">

       <div class="second_top2">
          <!--搜索框-->
          <div class="searchs">
            <search></search>
          </div>
        </div>
        <div class="second_bottom2">
        <!--左部分-->
        <div class="second_left">
            <!--左上-->
          <!-- <div class="left_top"> -->
            <!--地图-->
            <div class="maps">
              <s_map></s_map>
              <!-- <router-view />
              <map-component /> -->
            </div>
       </div>
         <!--右边-->
        <div class="second_right">
          <!--内容,背景等-->
          <div class="contents">
            <content></content>
          </div>
        </div>
        </div>
      </div>
</template>



<script>
import s_map from "@/components/two/Map.vue";
import search from "@/components/two/Searchs.vue";
import content from "@/components/two/Content.vue";
export default {
  name: "Second",
  components: {
    s_map,
    search,
    content,
    // photo,
  },
};
</script>

<style scoped>

/* .second_screen {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url(../assets/背景图.png);
    background-size: cover;
    background-repeat: no-repeat;
}

.second_main {
    width: 98%;
    height: 98%;
    display: flex;
    flex-direction: column;
    
    background-size: cover;
    background-repeat: no-repeat;
} */

.second_bottom {
  width: 100%;
  /* flex-grow: 1; */
  display: flex;
   flex-direction: column;
  background-image: url(@/assets/背景图.png);
  border-style: solid;
  border-color: #ffffff67;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 5px;
}

/* 导航栏 */
/* .second_top {
  width: 100%;
  height: 5%;
  margin-bottom: 1.5%;
} */

/* .second_bottom {
  height: 100%;
  display: flex;
  flex-direction: column;
} */

.second_top2 {
  height: 10%;
}

.second_bottom2 {
  flex: 1;
  /* 占据剩余空间 */
  display: flex;
  margin-top: 0.5%;
  /* 启用Flexbox以水平分割空间 */
}
.second_left {
  flex: 2;
  margin-bottom: 1%;
}
.second_right {
  flex: 1;
  margin-bottom: 1%;
  /* 占据另一半空间 */
}
.maps {
  width: 100%;
  height: 100%;
  /* background-color: aqua; */
}
.searchs {
  width: 100%;
  height: 100%;
  /* background-color: blue; */
}
.contents {
  width: 100%;
  height: 100%;
}
</style>
